<template>
  <div class="elm-edit">
    <elm-page-bb>
      <el-form ref="model" :model="model" size="small" label-width="140px">
        <elm-row>
          <el-form-item label="申请人" prop="applicant_name" :rules="[{ required: true, message: '必须填写'}]">
            <elm-ei v-model="model.applicant_name"></elm-ei>
          </el-form-item>
          <el-form-item label="用车部门" prop="applicant_department" :rules="[{ required: true, message: '必须填写'}]">
            <elm-org v-model="model.applicant_department"></elm-org>
          </el-form-item>
        </elm-row>
        <elm-row>
          <el-form-item label="申请日期" prop="application_date">
            <el-date-picker v-model="model.application_date" type="date" value-format="yyyy-MM-dd" style="width: 100%"  disabled></el-date-picker>
          </el-form-item>
          <el-form-item label="使用车辆" prop="car">
            <elm-car v-model="model.car"></elm-car>
          </el-form-item>
        </elm-row>
        <el-form-item label="用车目的" prop="usage_purpose" >
          <el-input v-model="model.usage_purpose"  type="textarea" :rows="2"></el-input>
        </el-form-item>
        <elm-row>
          <el-form-item label="预计用车开始时间" prop="estimated_start_time">
            <el-date-picker v-model="model.estimated_start_time" type="datetime" value-format="yyyy-MM-dd HH-mm-ss" style="width: 100%"></el-date-picker>
          </el-form-item>
          <el-form-item label="预计用车结束时间" prop="estimated_end_time">
            <el-date-picker v-model="model.estimated_end_time" type="datetime" value-format="yyyy-MM-dd HH-mm-ss" style="width: 100%"></el-date-picker>
          </el-form-item>
        </elm-row>
        <elm-row>
          <el-form-item label="实际用车开始时间" prop="actual_start_time">
            <el-date-picker v-model="model.actual_start_time" type="datetime" value-format="yyyy-MM-dd HH-mm-ss" style="width: 100%" disabled></el-date-picker>
          </el-form-item>
          <el-form-item label="实际用车结束时间" prop="actual_end_time">
            <el-date-picker v-model="model.actual_end_time" type="datetime" value-format="yyyy-MM-dd HH-mm-ss" style="width: 100%" disabled></el-date-picker>
          </el-form-item>
        </elm-row>
        <el-form-item label="备注" prop="remarks">
          <el-input v-model="model.remarks" type="textarea" :rows="2"></el-input>
        </el-form-item>
      </el-form>
      <template #bottom>
        <el-button type="success" size="small" @click="submit">立即保存</el-button>
        <el-button size="small" @click="close">取消</el-button>
      </template>
    </elm-page-bb>
  </div>
</template>

<script>
export default {
  extends: elmVueBase,
  data() {
    return {
      nowDate: new Date(),
      model: {
        id: elm.newGuid(),
        application_date: new Date()
      },
    }
  },
  async created() {
    this.model.application_date=this.nowDate.toISOString().split('T')[0];
    //console.log(this.model.application_date)
  },
  destroyed() {
    this.request.callVue.tablebinding();
  },
  methods: {

    async submit() {
      await this.$refs["model"].validate();
      var res = await elm.post('/business/tms/car_use/Upsert', this.model);
      if (res == true) {
        this.v('保存成功。')
        this.close();
        this.request.callVue.tablebinding();
      }
      else {
        this.error('保存失败，请稍后尝试。');
      }
    },
  }
}
</script>